<!--
 * @Description: 
 * @Author: william
 * @Date: 2025-05-21 09:48:22
 * @LastEditors: william
 * @LastEditTime: 2025-10-09 14:19:08
-->
<template>
  <el-select v-model="modelValue" :placeholder="getPlaceholder()" :="$attrs">
    <el-option
      v-for="item in options"
      :key="item[props.props.key]"
      :label="item[props.props.label]"
      :value="item[props.props.value]"
    />
  </el-select>
</template>

<script setup>
const props = defineProps({
  placeholder: {
    type: String,
    default: ''
  },
  label: {
    type: String,
    default: ''
  },
  options: {
    type: Array,
    default: () => []
  },
  props: {
    type: Object,
    default: () => {
      return {
        key: 'value',
        label: 'label',
        value: 'value'
      }
    }
  }
})

const modelValue = defineModel({
  required: true,
  type: String,
  default: ''
})

const getPlaceholder = _ => {
  return (
    props.placeholder ||
    g_rules.zhAndEnShowMsg(g_t('public.pleaseSelect'), props.label)
  )
}
</script>

<style scoped lang="scss"></style>
